import Vue from "vue";
import App from "./App.vue";
import router from "./router";       
import store from "./store";
import ElementUI from "element-ui"
import 'element-ui/lib/theme-chalk/index.css';
import "./assets/styles/base.css";
import "./assets/styles/el-reset.css";

import qfSubMenu from 'qf-sub-menu';
Vue.use(ElementUI);
Vue.use(qfSubMenu)
// Vue.config.productionTip = false;



router.beforeEach(function (to, from, next) {
  let token = localStorage.getItem("yf-token")
  if (token) {
    
    if (!store.state.sideMenu.length) {
      store.dispatch("FETCH_MENULIST")
        .then(() => {
          next({ path: to.path })
      })
    } else {
      next()
    }
  } else {
    if (to.path === "/login") {
      next()
    } else {
      next({ path: "/login" })
    }
  }
})

//自定义鉴权指令
Vue.directive('has', {
  inserted(el,binding) {
    //从本地取出用户的按钮权限
    let permission = localStorage.getItem("permission") || '[]'

    permission = JSON.parse(permission)
    if (!permission.includes(binding.value)) {
      let ElclassName = el.className
      el.className = ElclassName + " " + "disabled"
      el.disabled = true
      el.style.opacity=0.3
    }
  }
});


router.afterEach((to, from) => {//全局后置钩子
  let matched = [...to.matched]
  matched.splice(0, 1)
  store.commit("SET_BREADCRUMB",matched)
})

new Vue({

  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
